page,
view,
input,
button,
scroll-view {
  box-sizing: border-box;
}
page {
  --color-dark: #340F08;
  --color-light: #FFF8EF;
  --color-primary: #BB8554;
  --color-primary-bg: #e6f4ff;
  --color-error: #E31812;
  --color-error-shallow: #fd434310;
  --color-success: #1dba6e;
  --color-success-shallow: rgba(29, 186, 110, 0.1);
  --color-warning: #FF8D1A;
  --color-text-theme: #9C5023;
  --color-text-main: #482721;
  --color-text-second: #666;
  --color-text-third: #999;
  --size-text-xs: 20px;
  --size-text-sm: 24px;
  --size-text-base: 28px;
  --size-text-lg: 32px;
  --size-text-xl: 34px;
  --size-text-2xl: 36px;
  --color-bg-base: #FEF7ED;
  font-size: var(--size-text-base);
}
.safe-footer {
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
.flex-center {
  @apply flex, items-center, justify-center;
}
.shawdowTop {
  --tw-shadow: 0 -10rpx 15rpx -3rpx rgba(0, 0, 0, 0.1), 0 -4rpx 6rpx -4rpx rgba(0, 0, 0, 0.1);
  --tw-shadow-colored: 0 -10rpx 15rpx -3rpx var(--tw-shadow-color), 0 -4rpx 6rpx -4rpx var(--tw-shadow-color);
  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
button:not([size=mini]) {
  width: unset;
}
button[disabled] {
  background: var(--color-primary);
  opacity: 1;
}
